<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport"
				content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
	<meta http-equiv="X-UA-Compatible" content="ie=edge">
	<title>全国青少年电子信息智能创新大赛</title>
	<link rel="icon" href="./images/logo.png">
	<link rel="stylesheet" href="./lib/swiper/css/swiper.min.css">
	<link rel="stylesheet" href="./lib/layui/css/layui.css">
	<link rel="stylesheet" href="./css/news.css">
	<link rel="stylesheet" href="./lib/layui/css/modules/layer/default/layer.css">
	<script src="./lib/layui/layui.js"></script>
	<script src="./lib/layui/lay/modules/layer.js"></script>
</head>
<body>
<section class="wrapper" v-cloak>
	<common-header active-path="news.html"></common-header>
	<section class="banner" style="background-image: url(./images/about-banner.png);">
	</section>
	<section class="content">
		<section class="container">
			<section class="news-title">通知公告</section>
			<section class="news-list">
				<section v-if="list.length > 0">
					<a :href="'./news-details.html?id=' + item.id" v-for="item in list" class="news-item">
						<section class="img" :style="{backgroundImage: 'url(' + item.bannerImg + ')'}"></section>
						<section class="details">
							<section class="title">
								{{ item.title }}
								<section v-if="item.sortId > 0" class="tag">置顶</section>
							</section>
							<section class="text">
								{{ item.introduction | substr }}
								<!--							为促进AR/VR行业创新，构建极致用户体验，华为开发者联盟开启华为 3D为促进AR/VR行业创新，构建极致用户体验，华为开发者联盟开启华为 3D为促进AR/VR行业创新，构建极致用户体验，华为开发者联盟开启华为-->
								<!--							3D为促进AR/VR行业创新，构建极致用户体验，华为开发...-->
							</section>
							<section class="time">
								<img src="./images/icons/time.png" alt="">
								{{ formatTime(item.createTime) }}
							</section>

						</section>
					</a>
				</section>
				<Empty v-else text="暂无新闻动态哦" v-else></Empty>
			</section>
			<section id="page"></section>
		</section>
	</section>
	<common-footer></common-footer>
</section>
<script src="./lib/swiper/js/swiper.min.js"></script>
<script src="./js/jquery.min.js"></script>
<script src="./lib/layui/layui.js"></script>
<script src="../js/abkj/slAjax.js"></script>
<script src="../js/abkj/match/api/webinfo.js"></script>
<script src="../js/abkj/fun_tool.js"></script>
<script src="../js/abkj/match/api/news.js"></script>
<script src="../js/abkj/ext/news.js"></script>
<script src="./js/vue.min.js"></script>
<script src="./js/common.js"></script>
<script src="./components/index.js"></script>
<script>
	$(function () {
		new Vue({
			el: '.wrapper',
			data: {
				currTab: 1,
				page: 1,
				total: 0,
				laypage: null,
				list: []
			},
			mounted: function () {
				this.getData()
			},
			methods: {
				getData: function () {
					var vm = this
					// alert(vm)
					ClientNewsPageList2(

						{page: {current: this.page, size: 10},cond:{
							eq:{modelName:"通知公告"}
							,
		                    order:{ //排序条件
		                    	type:"desc",
		                    	attrName:["sort_id","create_time"]
		                    }
						}},
						function (data) {
							vm.total = data.total
							vm.list = data.records
							if (!layui.laypage) {
								layui.use(['laypage'], function () {
									layui.laypage.render({
										elem: 'page',
										count: vm.total,
										limit: 10,
										jump: function (obj, first) {
											if (first) return
											vm.page = obj.curr
											vm.getData()
										}
									})
								})
							}
						},
						function (err) {
							console.log(err)
						})
				},
				formatTime: function (time) {
					if (!time) return time
					return time.split('T')[0]
				},
			}
		})
	})
</script>
</body>
</html>
